<template>
    <el-dialog
        title="查看"
        :visible.sync="showValue"
        append-to-body
        :close-on-click-modal="false"
        width="800px"
        :before-close="clearData"
    >
        <div class="wrap">
            <el-form ref="form" :model="form" size="small" label-width="150px">
                <el-form-item label="方案名称：" prop="schemeName">
                    {{ form.schemeName }}
                </el-form-item>
                <el-form-item label="经营类型：" prop="platformNames">
                    {{ form.platformNames }}
                </el-form-item>
                <el-form-item label="服务：" prop="addServiceNames">
                    {{ form.addServiceNames }}
                </el-form-item>
                <el-form-item label="状态：" prop="status">
                    <span>{{ form.status === 1 ? '启用' : '停用' }}</span>
                </el-form-item>
                <el-form-item label="是否针对所有商家：" prop="allCompany">
                    <span>{{ form.allCompany === 1 ? '是' : '否' }}</span>
                </el-form-item>
                <el-form-item
                    label="指定商家："
                    v-if="form.allCompany === 0"
                    prop="companyNames"
                >
                    <span>{{ form.companyNames }}</span>
                </el-form-item>
                <el-form-item
                    label="方案描述："
                    prop="description"
                >
                    <span>{{ form.description }}</span>
                </el-form-item>
                <el-form-item label="充值规则：" prop="rules">
                    <el-table
                        :header-cell-style="headerCellStyle"
                        :data="form.rules"
                        style="width: 100%"
                        border
                        size="mini"
                    >
                        <el-table-column
                            align="center"
                            prop="price"
                            label="收费(元)"
                        >
                            <template slot-scope="scope">
                                {{ precision(scope.row.price) }}
                            </template>
                        </el-table-column>
                        <el-table-column
                            prop="buyDays"
                            align="center"
                            label="购买天数"
                        >
                        </el-table-column>
                        <el-table-column
                            prop="giftDays"
                            align="center"
                            label="赠送天数"
                        >
                        </el-table-column>
                        <el-table-column
                            prop="status"
                            align="center"
                            label="状态"
                        >
                            <template slot-scope="scope">
                                <span v-if="scope.row.status === 1">启用</span>
                                <span v-if="scope.row.status === 0">停用</span>
                            </template>
                        </el-table-column>
                        
                    </el-table>
                </el-form-item>
            </el-form>
        </div>
    </el-dialog>
</template>

<script>
export default {
    props: {
        value: Boolean,
        currRow: Object,
        id: Number
    },
    data () {
        return {
            showValue: false,
            form: {
                status: 1
            }
        }
    },
    watch: {
        value (val) {
            this.showValue = val
            if (val) {
                // this.companyList()
                this.getDetail()
            }
        },
        showValue (val) {
            this.$emit('update:value', val)
        }
    },
    methods: {
        async getDetail () {
            let res = await this.$axios.post(this.$store.state.ip + '/server/admin/serverinfo/info', {
                data: {
                    schemeID: this.currRow.schemeID
                }
            })
            let response = res.data
            if (response.ret === '0') {
                this.form = response.data
                this.form.companyNames = response.data.companyNames.join(',')
                console.log(this.form)
            }
        },
        // 清空数据
        clearData () {
            // this.form = []
            this.form = {}
            this.loading = false
            this.showValue = false
        }
    }
}
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
.wrap
    height: 400px
    overflow: auto

.tip
    color: red
    margin-bottom: 20px
</style>